<template>
  <div>
    <Row class="search-info-style">
      <Col span="6">
        <span style="">姓&#12288;&#12288;名：</span>
        <Input placeholder="请输入..." style="width: 70%;" v-model="searchInfo.cpbi003" />
      </Col>
      <Col span="6">
        <span style="">性&#12288;&#12288;别：</span>
        <Select v-model="searchInfo.cpbi005" clearable filterable transfer="" style="width: 70%;">
          <Option :value="'0'" >男</Option>
          <Option :value="'1'" >女</Option>
        </Select>
      </Col>
      <Col span="6">
        <span>政治面貌：</span>
        <Select v-model="searchInfo.cpbi008" filterable clearable transfer="" style="width: 70%;">
          <Option :value="item.TYPECODE" v-for="item in dictList[0]" v-bind:key="item.TYPECODE">{{item.TYPENAME}}</Option>
        </Select>
      </Col>
    </Row>
    <Row class="search-info-style" >
      <Col span="6">
        <span style="">身份证号：</span>
        <Input placeholder="请输入..." style="width: 70%;" v-model="searchInfo.cpbi002" />
      </Col>
      <Col span="6">
        <span style="">联系方式：</span>
        <Input placeholder="请输入..." style="width: 70%;" v-model="searchInfo.cpbi013" />
      </Col>
      <Col span="6">
        <span>社工状态：</span>
        <Select v-model="searchInfo.CPBI018" clearable filterable transfer="" style="width: 70%;">
          <Option :value="item.TYPECODE" v-for="item in dictList[15]" v-bind:key="item.TYPECODE">{{item.TYPENAME}}</Option>
        </Select>
      </Col>
    </Row>
    <Row class="search-info-style" >
      <Col span="6" v-if="this.$store.state.user.severUserInfo.company_grade === '2'">
        <span>所在区县：</span>
        <Select v-model="searchInfo.cpwi023" filterable transfer="" clearable @on-change="getMailList2(4,searchInfo.CPWI023)" style="width:70%">
          <Option :value="item.code" v-for="item in mailList1" v-bind:key="item.code">{{item.name}}</Option>
        </Select>
      </Col>
      <Col span="6" v-if="this.$store.state.user.severUserInfo.company_grade === '2' || this.$store.state.user.severUserInfo.company_grade === '3'">
        <span>所在街道：</span>
        <Select v-model="searchInfo.cpwi024" filterable transfer="" clearable @on-change="getMailList2(5, searchInfo.CPWI024)" style="width:70%">
          <Option :value="item.code" v-for="item in mailList2" v-bind:key="item.code">{{item.name}}</Option>
        </Select>
      </Col>
      <Col span="6">
        <span>所在社区：</span>
        <Select v-model="searchInfo.cpwi025" filterable transfer="" clearable style="width:70%">
          <Option :value="item.code" v-for="item in mailList3" v-bind:key="item.code">{{item.name}}</Option>
        </Select>
      </Col>
    </Row>
    <Row class="search-info-style">
      <Col span="20"></Col>
      <Col span="4">
        <Button class="new-btn-sty" @click="findinit">
          <Icon type="ios-search" /> 查询
        </Button>
        <Button class="new-btn-sty" @click="searchDatawork">
          <Icon type="success" /> 重置
        </Button>
        <Button class="new-btn-sty" @click="addModal = true; familyInfoList = []; assessmentInfoList = []; sessionInfoList = [];
         addinfo = {}; fileUrlList = []; fileUrlList2 = []; fileUrlList3 = []; status = false; message = '提交审核'"
                v-if="this.$store.state.user.severUserInfo.company_grade === '5' && loginName.indexOf('admin') === -1">
          <Icon type="success" /> 录入
        </Button>
      </Col>
    </Row>
    <Row>
      <Col span="24" >
        <Table border  :columns="columns" :data="datalist" ref="personSelection" style="margin-top:10px;">
          <template slot-scope="{row}" slot="cpbi008">
            <div v-for="item in dictList[0]" :key="item.TYPECODE">
              <span v-if="row.cpbi008 === item.TYPECODE">{{item.TYPENAME}}</span>
            </div>
          </template>
          <template slot-scope="{row}" slot="cpbi018" >
            <div v-for="item in dictList[15]" :key="item.TYPECODE">
              <span v-if="row.cpbi018 === item.TYPECODE">{{item.TYPENAME}}</span>
            </div>
          </template>
          <template slot-scope="{ row }" slot="action">
            <Button type="primary" size="small" style="margin-right: 5px" @click="show(row)">查看</Button>
            <Button type="primary" size="small" style="margin-right: 5px" @click="updatePersonnel(row)"
                    v-if="(row.cpbi018 === '0' || row.cpbi018 === '1' || row.cpbi018 === '4' || row.cpbi018 === '7')
                     && loginName.indexOf('admin') === -1 && companyGrade === '5'">编辑</Button>
            <Button type="error" style="margin-right: 5px" v-if="row.cpbi018 === '1' && loginName.indexOf('admin') === -1"
                    size="small" @click="remove(row)">注销</Button>
            <Button type="warning" style="margin-right: 5px" v-if="(row.cpbi018 === '2' || row.cpbi018 === '3' || row.cpbi018 === '5')&& loginName.indexOf('admin') !== -1"
                    size="small" @click="approve(row, '是否确认此人员信息', 1)">信息确认</Button>
            <Button type="error" style="margin-right: 5px" v-if="(row.cpbi018 === '2' || row.cpbi018 === '3' || row.cpbi018 === '5')&& loginName.indexOf('admin') !== -1"
                    size="small" @click="approve(row, '是否驳回此人员信息', 0)">信息驳回</Button>
          </template>
        </Table>
        <Row v-if="searchInfo.loading1 == true">
          <Col class="demo-spin-col" span="8" offset="8">
            <Spin fix>
              <Icon type="ios-loading" size=18 class="demo-spin-icon-load"></Icon>
              <div>数据正在加载</div>
            </Spin>
          </Col>
        </Row>
      </Col>
    </Row>
    <Page :total="searchInfo.totalnum" class="page_style" :current="searchInfo.currentPageNo"
          :page-size="searchInfo.currentPageSize" @on-change="changePageNo" show-total show-elevator show-sizer @on-page-size-change="changePagesize"/>
    <Modal
      v-model="addModal" title="录入"
      width="100%"
      @on-ok="addOk"
      :ok-text="message"
      cancel-text="取消"
      @on-cancel="addModal = false">
      <div style="width: 100%;">
        <Row class="bench_search" >
          <Col span="5" align="center" >姓名<span style="color: red">(必填)</span></Col>
          <Col span="6">
            <Input :disabled="status" v-model="addinfo.cpbi003" type="text" style="width: 52.5%"></Input>
          </Col>
          <Col span="4" align="center" >身份证号<span style="color: red">(必填)</span></Col>
          <Col span="9">
            <Input :disabled="status" v-model="addinfo.cpbi002" type="text" style="width: 35%"></Input>
          </Col>
        </Row>
        <Row class="bench_search">
          <Col span="5" align="center">性别<span style="color: red">(必填)</span></Col>
          <Col span="6" >
            <Select v-model="addinfo.cpbi005" filterable transfer="" style="width: 52.5%;">
              <Option :value="'0'" >男</Option>
              <Option :value="'1'" >女</Option>
            </Select>
          </Col>
          <Col span="4" align="center">婚姻状况<span style="color: red">(必填)</span></Col>
          <Col span="9" >
            <Select v-model="addinfo.cpbi006" filterable transfer="" style="width: 35%;">
              <Option :value="item.TYPECODE" v-for="item in dictList[3]" v-bind:key="item.TYPECODE">{{item.TYPENAME}}</Option>
            </Select>
          </Col>
        </Row>
        <Row class="bench_search">
          <Col span="5" align="center">民族<span style="color: red">(必填)</span></Col>
          <Col span="6" >
            <Select v-model="addinfo.cpbi007" filterable transfer="" style="width: 52.5%;">
              <Option :value="item.TYPECODE" v-for="item in dictList[4]" v-bind:key="item.TYPECODE">{{item.TYPENAME}}</Option>
            </Select>
          </Col>
          <Col span="4" align="center">政治面貌<span style="color: red">(必填)</span></Col>
          <Col span="9" >
            <Select v-model="addinfo.cpbi008" filterable transfer="" style="width: 35%;">
              <Option :value="item.TYPECODE" v-for="item in dictList[0]" v-bind:key="item.TYPECODE">{{item.TYPENAME}}</Option>
            </Select>
          </Col>
        </Row>
        <Row class="bench_search">
          <Col span="5" align="center">是否退役士兵定向<span style="color: red">(必填)</span></Col>
          <Col span="6" >
            <Select v-model="addinfo.cpbi009" filterable transfer="" style="width: 52.5%;">
              <Option :value="'Y'" >是</Option>
              <Option :value="'N'" >否</Option>
            </Select>
          </Col>
          <Col span="4" align="center">是否军嫂定向<span style="color: red">(必填)</span></Col>
          <Col span="9" >
            <Select v-model="addinfo.cpbi010" filterable transfer="" style="width: 35%;">
              <Option :value="'Y'" >是</Option>
              <Option :value="'N'" >否</Option>
            </Select>
          </Col>
        </Row>
        <Row class="bench_search">
          <Col span="5" align="center">家庭住址<span style="color: red">(必填)</span></Col>
          <Col span="6" >
            <Input v-model="addinfo.cpbi014" type="text" style="width: 52.5%"></Input>
          </Col>
          <Col span="4" align="center">户籍地址<span style="color: red">(必填)</span></Col>
          <Col span="9" >
            <Input v-model="addinfo.cpbi012" type="text" style="width: 35%"></Input>
          </Col>
        </Row>
        <Row class="bench_search">
          <Col span="5" align="center">联系方式<span style="color: red">(必填)</span></Col>
          <Col span="6" >
            <Input v-model="addinfo.cpbi013" type="text" style="width: 52.5%"></Input>
          </Col>
<!--          <Col span="4" align="center">家庭住址<span style="color: red">(必填)</span></Col>-->
<!--          <Col span="9" >-->
<!--            <Input v-model="addinfo.CPBI014" type="text" style="width: 35%"></Input>-->
<!--          </Col>-->
        </Row>
        <Row class="bench_search">
          <Col span="5" align="center">免冠照片<span style="color: red">(必填)</span></Col>
          <Col span="4" >
            <Upload v-if="addinfo.files === undefined || fileUrlList.length < 0" multiple type="drag" action="http://120.27.63.37:38081/api/ac/file/fileCommonService/upLoadFiles" :before-upload="beforeUpload" style="">
              <!-- <Button icon="ios-cloud-upload-outline">上传附件</Button>
              <span style="margin-left: 100px">请上传小于100M的文件（.jpg/.png/.ico/.pdf/.doc/.docx/.excel）</span> -->
              <div style="padding: 40px 50px">
                <Icon type="ios-cloud-upload" size="52" style="color: #3399ff"></Icon>
                <p>免冠照片, 最大为2M,最大像素为200 * 300(.jpg/.png)</p>
              </div>
            </Upload>
            <div v-if="addinfo.files || fileUrlList.length > 0">
              <Row :gutter="20">
                <Col span="16">
                  <div v-for="(item, index) in fileUrlList" :key="'index3'+index" >
                    <img :src="item" :title="item" width="150px" height="200px" style="color: #457eca; font-size: 14px;"></img>
                    <button style="float: right;position: absolute;" @click="addIMG1">重新上传</button>
                  </div>
                </Col>
              </Row>
            </div>
          </Col>
          <Col span="4" align="center">身份证正反上传<span style="color: red">(必填)</span></Col>
          <Col span="9" >
            <Upload v-if="addinfo.files2 === undefined || fileUrlList2.length < 0" multiple type="drag" action="http://120.27.63.37:38081/api/ac/file/fileCommonService/upLoadFiles" :before-upload="beforeUpload2" style="width: 250px;float: left">
              <!-- <Button icon="ios-cloud-upload-outline">上传附件</Button>
              <span style="margin-left: 100px">请上传小于100M的文件（.jpg/.png/.ico/.pdf/.doc/.docx/.excel）</span> -->
              <div style="padding: 40px 40px;">
                <Icon type="ios-cloud-upload" size="52" style="color: #3399ff"></Icon>
                <p>身份证正面照片, 最大为2M(.jpg/.png)</p>
              </div>
            </Upload>
            <div v-if="addinfo.files2 || fileUrlList2.length > 0" style="float: left">
              <Row :gutter="20">
                <Col span="24">
                  <div v-for="(item, index) in fileUrlList2" :key="index" style="float: left; margin-right: 5px">
                    <img :src="item" :title="item" width="250px" height="170px" style="float: left;"></img>
                    <button @click="addIMG2">重新上传</button>
                  </div>
                </Col>
              </Row>
            </div>
            <!--反面-->
            <Upload v-if="addinfo.files3 === undefined || fileUrlList3.length < 0" multiple type="drag" action="http://120.27.63.37:38081/api/ac/file/fileCommonService/upLoadFiles" :before-upload="beforeUpload3" style="width: 250px;float: left">
              <!-- <Button icon="ios-cloud-upload-outline">上传附件</Button>
              <span style="margin-left: 100px">请上传小于100M的文件（.jpg/.png/.ico/.pdf/.doc/.docx/.excel）</span> -->
              <div style="padding: 40px 40px;">
                <Icon type="ios-cloud-upload" size="52" style="color: #3399ff"></Icon>
                <p>身份证反面照片, 最大为2M(.jpg/.png)</p>
              </div>
            </Upload>
            <div v-if="addinfo.files3 || fileUrlList3.length > 0" style="float: left">
              <Row :gutter="20">
                <Col span="24">
                  <div v-for="(item, index) in fileUrlList3" :key="index + '0'" style="float: left;margin-left: 10px">
                    <img :src="item" :title="item" width="250px" height="170px" style="float: left;"></img>
                    <button @click="addIMG3">重新上传</button>
                  </div>
                </Col>
              </Row>
            </div>
          </Col>
        </Row>
      </div>
    </Modal>

    <Modal
      v-model="showModal" title="查看"
      width="100%"
      @on-ok="showModal = false"
      ok-text="确定"
      cancel-text="取消"
      @on-cancel="showModal = false">
      <div style="width: 100%;">
        <Row class="bench_search" >
          <Col span="5" align="center" >姓名<span style="color: red">(必填)</span></Col>
          <Col span="6">
            <Input disabled v-model="addinfo.cpbi003" type="text" style="width: 52.5%"></Input>
          </Col>
          <Col span="4" align="center" >身份证号<span style="color: red">(必填)</span></Col>
          <Col span="9">
            <Input disabled v-model="addinfo.cpbi002" type="text" style="width: 35%"></Input>
          </Col>
        </Row>
        <Row class="bench_search">
          <Col span="5" align="center">性别<span style="color: red">(必填)</span></Col>
          <Col span="6" >
            <Select disabled v-model="addinfo.cpbi005" filterable transfer="" style="width: 52.5%;">
              <Option :value="'0'" >男</Option>
              <Option :value="'1'" >女</Option>
            </Select>
          </Col>
          <Col span="4" align="center">婚姻状况<span style="color: red">(必填)</span></Col>
          <Col span="9" >
            <Select disabled v-model="addinfo.cpbi006" filterable transfer="" style="width: 35%;">
              <Option :value="item.TYPECODE" v-for="item in dictList[3]" v-bind:key="item.TYPECODE">{{item.TYPENAME}}</Option>
            </Select>
          </Col>
        </Row>
        <Row class="bench_search">
          <Col span="5" align="center">民族<span style="color: red">(必填)</span></Col>
          <Col span="6" >
            <Select disabled v-model="addinfo.cpbi007" filterable transfer="" style="width: 52.5%;">
              <Option :value="item.TYPECODE" v-for="item in dictList[4]" v-bind:key="item.TYPECODE">{{item.TYPENAME}}</Option>
            </Select>
          </Col>
          <Col span="4" align="center">政治面貌<span style="color: red">(必填)</span></Col>
          <Col span="9" >
            <Select disabled v-model="addinfo.cpbi008" filterable transfer="" style="width: 35%;">
              <Option :value="item.TYPECODE" v-for="item in dictList[0]" v-bind:key="item.TYPECODE">{{item.TYPENAME}}</Option>
            </Select>
          </Col>
        </Row>
        <Row class="bench_search">
          <Col span="5" align="center">是否退役士兵定向<span style="color: red">(必填)</span></Col>
          <Col span="6" >
            <Select disabled v-model="addinfo.cpbi009" filterable transfer="" style="width: 52.5%;">
              <Option :value="'Y'" >是</Option>
              <Option :value="'N'" >否</Option>
            </Select>
          </Col>
          <Col span="4" align="center">是否军嫂定向<span style="color: red">(必填)</span></Col>
          <Col span="9" >
            <Select disabled v-model="addinfo.cpbi010" filterable transfer="" style="width: 35%;">
              <Option :value="'Y'" >是</Option>
              <Option :value="'N'" >否</Option>
            </Select>
          </Col>
        </Row>
        <Row class="bench_search">
          <Col span="5" align="center">家庭住址<span style="color: red">(必填)</span></Col>
          <Col span="6" >
            <Input disabled v-model="addinfo.cpbi014" type="text" style="width: 52.5%"></Input>
          </Col>
          <Col span="4" align="center">户籍地址<span style="color: red">(必填)</span></Col>
          <Col span="9" >
            <Input disabled v-model="addinfo.cpbi012" type="text" style="width: 35%"></Input>
          </Col>
        </Row>
        <Row class="bench_search">
          <Col span="5" align="center">联系方式<span style="color: red">(必填)</span></Col>
          <Col span="6" >
            <Input disabled v-model="addinfo.cpbi013" type="text" style="width: 52.5%"></Input>
          </Col>
        </Row>
        <Row class="bench_search">
          <Col span="5" align="center">免冠照片<span style="color: red">(必填)</span></Col>
          <Col span="4" >
            <!--            <Upload v-if="addinfo.files === undefined || fileUrlList.length < 0" multiple type="drag" action="http://120.27.63.37:38081/api/ac/file/fileCommonService/upLoadFiles" style="">-->
            <!--              &lt;!&ndash; <Button icon="ios-cloud-upload-outline">上传附件</Button>-->
            <!--              <span style="margin-left: 100px">请上传小于100M的文件（.jpg/.png/.ico/.pdf/.doc/.docx/.excel）</span> &ndash;&gt;-->
            <!--              <div style="padding: 40px 50px">-->
            <!--                <Icon type="ios-cloud-upload" size="52" style="color: #3399ff"></Icon>-->
            <!--                <p>免冠照片, 最大为2M,最大像素为200 * 300(.jpg/.png)</p>-->
            <!--              </div>-->
            <!--            </Upload>-->
            <div v-if="addinfo.files || fileUrlList.length > 0">
              <Row :gutter="20">
                <Col span="16">
                  <div v-for="(item, index) in fileUrlList" :key="'index3'+index" >
                    <img :src="item" :title="item" width="150px" height="200px" style="color: #457eca; font-size: 14px;"></img>
                    <!--                    <button style="float: right;position: absolute;" @click="addIMG1">重新上传</button>-->
                  </div>
                </Col>
              </Row>
            </div>
          </Col>
          <Col span="4" align="center">身份证正反上传<span style="color: red">(必填)</span></Col>
          <Col span="9" >
            <div v-if="addinfo.files2 || fileUrlList2.length > 0" style="float: left">
              <Row :gutter="20">
                <Col span="24">
                  <div v-for="(item, index) in fileUrlList2" :key="index" style="float: left; margin-right: 5px">
                    <img :src="item" :title="item" width="250px" height="170px" style="float: left;"></img>
                    <!--                    <button @click="addIMG2">重新上传</button>-->
                  </div>
                </Col>
              </Row>
            </div>
            <div v-if="addinfo.files3 || fileUrlList3.length > 0" style="float: left">
              <Row :gutter="20">
                <Col span="24">
                  <div v-for="(item, index) in fileUrlList3" :key="index + '0'" style="float: left;margin-left: 10px">
                    <img :src="item" :title="item" width="250px" height="170px" style="float: left;"></img>
                    <!--                    <button @click="addIMG3">重新上传</button>-->
                  </div>
                </Col>
              </Row>
            </div>
          </Col>
        </Row>
      </div>
    </Modal>
  </div>
</template>
<script>
import {
  getTypeNameList,
  getOffice,
  addCommunityMembers,
  getCommunityMembersPageList,
  updateCommunityMembers,
  updateApproval, updateLogout
} from '@/api/eventlist'
import {createUpLoadFiles, getSign} from '@/api/common'
export default {
  data () {
    return {
      message: '',
      showModal: false,
      addModal: false,
      judge: false,
      judge2: false,
      judge3: false,
      status: false,
      addinfo: {},
      searchInfo: {
        currentPageNo: 1,
        currentPageSize: 10,
        loading1: true
      },
      upPicData: {
        filePath: '',
        fileName: ''
      },
      dictAllList: [],
      dictList: [[], [], []],
      columns: [
        { type: 'index', width: 50, align: 'center' },
        { title: '姓名', key: 'cpbi003', minWidth: 90, align: 'center' },
        { title: '性别', key: 'sex', width: 80, align: 'center' },
        { title: '年龄', key: 'age', width: 80, align: 'center' },
        { title: '身份证号', key: 'cpbi002', minWidth: 160, align: 'center' },
        { title: '政治面貌', slot: 'cpbi008', width: 100, align: 'center' },
        { title: '联系方式', key: 'cpbi013', width: 120, align: 'center' },
        { title: '免冠照片',
          width: 100,
          align: 'center',
          render: (h, params) => {
            return h('img', {
              attrs: {
                // src: 'http://xoss.shengshitong.com/mzdestitutefiles/100005a8665d54b23254066708798c29?Expires=17016808448&OSSAccessKeyId=mrjNmPR3jFdIjEk8&Signature=4WhC1uS%2FiB1HoBjebGKBUFpx13I%3D'
                src: params.row.cpbi015
              },
              style: {
                marginRight: '5px',
                height: '45px'
              },
              on: {
                click: () => {
                  console.log(h)
                }
              }
            })
          }
        },
        { title: '所在区县', key: 'city_name', width: 100, align: 'center' },
        { title: '所在街道', key: 'street_name', width: 100, align: 'center' },
        { title: '所在社区', key: 'community_name', width: 100, align: 'center' },
        { title: '社工状态', slot: 'cpbi018', width: 100, align: 'center' },
        {title: '操作', slot: 'action', width: 250, align: 'center'}
      ],
      datalist: [],
      fileUrlList: [],
      fileUrlList2: [],
      fileUrlList3: [],
      mailList1: [],
      mailList2: [],
      mailList3: []
    }
  },
  methods: {
    init() {
      getCommunityMembersPageList(this.searchInfo).then(res => {
        console.log(res)
        if (res.data.errcode === 0) {
          this.datalist = res.data.data.results
          this.searchInfo.loading1 = false
          this.searchInfo.totalnum = res.data.data.totalRecord
        } else {
          this.$Notice.error({
            title: '人员列表获取失败',
            desc: res.data.errmsg
          })
        }
      })
    },
    findinit() {
      this.searchInfo.currentPageNo = 1
      this.init()
    },
    addOk() {
      if (this.status) {
        this.updateInfo(1)
      } else {
        this.addInfo(1)
      }
    },
    addInfo(submit) {
      this.addinfo.submit = submit
      this.addinfo.cpbi015 = this.addinfo.files
      this.addinfo.cpbi016 = this.addinfo.files2
      this.addinfo.cpbi019 = this.addinfo.files3
      addCommunityMembers(this.addinfo).then(res => {
        if (res.data.errcode === 0) {
          this.addinfo = {}
          this.addModal = false
          this.searchInfo = {
            currentPageNo: 1,
            currentPageSize: 10,
            loading1: true
          }
          this.$Notice.success({title: '添加成功', desc: ''})
          this.init()
        } else {
          this.$Notice.error({
            title: '录入人员信息失败',
            desc: res.data.errmsg
          })
        }
      })
    },
    updateInfo(submit) {
      this.addinfo.cpbi015 = this.addinfo.files
      this.addinfo.cpbi016 = this.addinfo.files2
      this.addinfo.cpbi019 = this.addinfo.files3
      this.addinfo.submit = submit
      updateCommunityMembers(this.addinfo).then(res => {
        if (res.data.errcode === 0) {
          this.addinfo = {}
          this.addModal = false
          this.searchInfo = {
            currentPageNo: 1,
            currentPageSize: 10,
            loading1: true
          }
          this.$Notice.success({title: '修改成功', desc: ''})
          this.init()
        } else {
          this.$Notice.error({
            title: '录入人员信息失败',
            desc: res.data.errmsg
          })
        }
      })
    },
    copyInfo (row) {
      this.addinfo = {}
      this.fileUrlList = []
      this.fileUrlList2 = []
      this.fileUrlList3 = []
      this.addinfo = row
      if (row.cpbi015) {
        this.judge = true
        this.addinfo.files = row.cpbi015
        this.fileUrlList.push(row.cpbi015)
      }
      if (row.cpbi016) {
        this.judge2 = true
        this.addinfo.files2 = row.cpbi016
        this.fileUrlList2.push(row.cpbi016)
      }
      if (row.cpbi019) {
        this.judge3 = true
        this.addinfo.files3 = row.cpbi019
        this.fileUrlList3.push(row.cpbi019)
      }
    },
    show(row) {
      this.copyInfo(row)
      this.showModal = true
    },
    updatePersonnel(row) {
      this.message = '确定'
      this.status = true
      this.copyInfo(row)
      this.addModal = true
    },
    remove(item) {
      if (confirm('是否注销此人员？')) {
        item.effective = '0'
        updateLogout({id: item.id}).then(res => {
          if (res.data.errcode === 0) {
            this.init()
            this.$Notice.success({title: '操作成功', desc: ''})
          } else {
            this.$Notice.error({
              title: '操作失败',
              desc: res.data.errmsg
            })
          }
        })
      }
    },
    approve (item, message, approve) {
      if (confirm(message)) {
        let param = {
          id: item.id,
          approval: approve
        }
        updateApproval(param).then(res => {
          if (res.data.errcode === 0) {
            this.init()
            this.$Notice.success({title: '操作完成', desc: ''})
          } else {
            this.$Notice.error({
              title: '操作失败',
              desc: res.data.errmsg
            })
          }
        })
      }
    },
    searchDatawork() {
      this.searchInfo = {}
      this.init()
    },
    changePagesize(pageSize) {
      this.searchInfo.currentPageSize = pageSize
      this.changePageNo()
    },
    changePageNo(pageNo) {
      this.searchInfo.currentPageNo = pageNo
      this.init()
    },
    addIMG1() {
      if (confirm('是否确定重新上传？')) {
        this.fileUrlList = []
        this.judge = false
        this.addinfo.files = undefined
      }
    },
    addIMG2() {
      if (confirm('是否确定重新上传？')) {
        this.fileUrlList2 = []
        this.judge2 = false
        this.addinfo.files2 = undefined
      }
    },
    addIMG3() {
      if (confirm('是否确定重新上传？')) {
        this.fileUrlList3 = []
        this.judge3 = false
        this.addinfo.files3 = undefined
      }
    },
    beforeUpload(file) {
      console.log('上传相关操作： ', file)
      var time = new Date().getTime()
      this.timeStep = time.toString()
      this.upPicData.fileName = this.timeStep + file.name
      this.upPicData.filePath = 'smz/cardm'
      let that = this
      const reader = new FileReader()
      reader.readAsDataURL(file)
      reader.onload = () => {
        let index = reader.result.indexOf('base64,') + 7
        that.upPicData.file = reader.result.substring(index)
        this.fileUrlList = []
        this.addinfo.files = undefined
        that.upPic(that.upPicData, file)
      }
      return false
    },
    // 上传图片
    upPic(obj, file) {
      var time = new Date().getTime()
      this.timeStep = time.toString()
      let param = {
        filePath: obj.filePath,
        fileName: obj.fileName,
        timestamp: this.timeStep
      }
      if (param.fileName.length > 20) {
        param.fileName = param.fileName.substring(0, 20) + file.name
      }
      getSign(param).then(res => {
        if (res.data.errcode === 0) {
          createUpLoadFiles(res.data.data.docking_url, {
            sign: res.data.data.sign,
            timestamp: this.timeStep,
            filePath: param.filePath,
            fileName: param.fileName,
            file: obj.file
          }).then(res => {
            if (res.data.errcode === 0) {
              let Url = res.data.data
              if (this.addinfo.files === undefined || this.addinfo.files.length === 0) {
                this.addinfo.files = Url
              } else {
                this.addinfo.files = this.addinfo.files + ',' + Url
              }
              this.fileUrlList.push(Url)
              this.index1 = this.fileUrlList.length - 1
              this.judge = true
            } else {
              this.$Notice.error({title: '上传失败', desc: res.data.data.msg})
            }
          })
        } else {
          this.$Notice.error({title: '上传失败', desc: res.data.data.msg})
        }
      })
    },
    // 上传相关
    beforeUpload2(file) {
      console.log('上传相关操作： ', file)
      var time = new Date().getTime()
      this.timeStep = time.toString()
      this.upPicData.fileName = this.timeStep + file.name
      this.upPicData.filePath = 'smz/cardz'
      let that = this
      const reader = new FileReader()
      reader.readAsDataURL(file)
      reader.onload = () => {
        let index = reader.result.indexOf('base64,') + 7
        that.upPicData.file = reader.result.substring(index)
        this.fileUrlList2 = []
        this.addinfo.files2 = undefined
        that.upPic2(that.upPicData, file)
      }
      return false
    },
    // 上传图片
    upPic2(obj, file) {
      var time = new Date().getTime()
      this.timeStep = time.toString()
      let param = {
        filePath: obj.filePath,
        fileName: obj.fileName,
        timestamp: this.timeStep
      }
      if (param.fileName.length > 20) {
        param.fileName = param.fileName.substring(0, 20) + file.name
      }
      getSign(param).then(res => {
        if (res.data.errcode === 0) {
          createUpLoadFiles(res.data.data.docking_url, {
            sign: res.data.data.sign,
            timestamp: this.timeStep,
            filePath: param.filePath,
            fileName: param.fileName,
            file: obj.file
          }).then(res => {
            if (res.data.errcode === 0) {
              let Url = res.data.data
              if (this.addinfo.files2 === undefined || this.addinfo.files2.length === 0) {
                this.addinfo.files2 = Url
              } else {
                this.addinfo.files2 = this.addinfo.files2 + ',' + Url
              }
              this.fileUrlList2.push(Url)
              this.index2 = this.fileUrlList2.length - 1
              this.judge2 = true
            } else {
              this.$Notice.error({title: '上传失败', desc: res.data.data.msg})
            }
          })
        } else {
          this.$Notice.error({title: '上传失败', desc: res.data.data.msg})
        }
      })
    },
    // 上传相关
    beforeUpload3(file) {
      console.log('上传相关操作： ', file)
      var time = new Date().getTime()
      this.timeStep = time.toString()
      this.upPicData.fileName = this.timeStep + file.name
      this.upPicData.filePath = 'smz/cardf'
      let that = this
      const reader = new FileReader()
      reader.readAsDataURL(file)
      reader.onload = () => {
        let index = reader.result.indexOf('base64,') + 7
        that.upPicData.file = reader.result.substring(index)
        this.fileUrlList3 = []
        this.addinfo.files3 = undefined
        that.upPic3(that.upPicData, file)
      }
      return false
    },
    // 上传图片
    upPic3(obj, file) {
      var time = new Date().getTime()
      this.timeStep = time.toString()
      let param = {
        filePath: obj.filePath,
        fileName: obj.fileName,
        timestamp: this.timeStep
      }
      if (param.fileName.length > 20) {
        param.fileName = param.fileName.substring(0, 20) + file.name
      }
      getSign(param).then(res => {
        if (res.data.errcode === 0) {
          createUpLoadFiles(res.data.data.docking_url, {
            sign: res.data.data.sign,
            timestamp: this.timeStep,
            filePath: param.filePath,
            fileName: param.fileName,
            file: obj.file
          }).then(res => {
            if (res.data.errcode === 0) {
              let Url = res.data.data
              if (this.addinfo.files3 === undefined || this.addinfo.files3.length === 0) {
                this.addinfo.files3 = Url
              } else {
                this.addinfo.files3 = this.addinfo.files3 + ',' + Url
              }
              this.fileUrlList3.push(Url)
              this.index3 = this.fileUrlList3.length - 1
              this.judge3 = true
            } else {
              this.$Notice.error({title: '上传失败', desc: res.data.data.msg})
            }
          })
        } else {
          this.$Notice.error({title: '上传失败', desc: res.data.data.msg})
        }
      })
    },
    getTypeName(id, index) {
      let list = []
      this.dictAllList.forEach(item => {
        if (item.TYPEGROUPCODE === id) {
          list.push(item)
        }
      })
      this.$set(this.dictList, index, list)
    },
    getDictList() {
      if (!localStorage.getItem('dictList')) {
        getTypeNameList({}).then(res => {
          if (res.data.errcode === 0) {
            localStorage.setItem('dictList', JSON.stringify(res.data.data))
            this.dictAllList = res.data.data
            this.dictSet()
          } else {
            this.$Notice.error({
              title: '获取字典列表失败',
              desc: res.data.errmsg
            })
          }
        })
      } else {
        this.dictAllList = JSON.parse(localStorage.getItem("dictList"))
        this.dictSet()
      }
    },
    dictSet () {
      this.getTypeName('political', 0) // 政治面貌
      this.getTypeName('position', 1)
      this.getTypeName('marriage', 3) // 婚姻
      this.getTypeName('nation', 4) // 民族
      this.getTypeName('community_state', 15)
    },
    getMailList(grade, code) {
      getOffice({grade: grade, code: code}).then(res => {
        if (res.data.errcode === 0) {
          this.mailList1 = res.data.data
          let xiehui = {code: "1", name: "社区工作者协会", master: "社区工作者协会"}
          this.mailList1.push(xiehui)
        } else {
          this.$Notice.error({title: '获取信息失败', desc: '查询区域列表信息失败'})
        }
      })
    },
    getMailList2(grade, code) {
      // this.searchInfo['grade' + (index + 1)] = 0
      getOffice({code: code}).then(res => {
        if (res.data.errcode === 0) {
          if (grade === 4) {
            this.mailList2 = res.data.data
            let xiehui = {code: "1", name: "社区工作者协会", master: "社区工作者协会"}
            this.mailList2.push(xiehui)
          } else if (grade === 5) {
            this.mailList3 = res.data.data
          }
          // this.mailList[index].unshift({ id: 0, title: '全部' })
          // this.$forceUpdate()
        } else {
          this.$Notice.error({title: '获取信息失败', desc: '查询区域列表信息失败'})
        }
      })
    }
  },
  mounted() {
    this.getDictList()
    this.init()
    if (this.companyGrade < 3) {
      this.getMailList(2, null)
    } else if (this.companyGrade < 4) {
      this.getMailList2(4, this.companyCode)
    } else if (this.companyGrade < 5) {
      this.getMailList2(5, this.companyCode)
    }
  },
  computed: {
    companyGrade () {
      return this.$store.state.user.severUserInfo.company_grade
    },
    companyCode () {
      return this.$store.state.user.severUserInfo.company_code
    },
    loginName () {
      return this.$store.state.user.severUserInfo.loginName
    }
  }
}
</script>
<style>
.card_style {
  height: 100%;
  width: 100%;
  overflow: hidden;

  .ivu-card-body {
    padding: 0px;
  }
}

.page_style {
  margin-top: 10px;
  text-align: right;
}

.bench_search {
  margin-bottom: 10px;
}

.nopadding .ivu-table-cell {
  padding: 0px 0px;
}

.item1 {
  height: 42px;
  line-height: 40px;
}

.marginR2 {
  margin-right: 2%;
}

.fontsize20 {
  font-size: 20px;
}

.fontTitle {
  font-size: 20px;
  height: 52px;
  text-align: right;
  padding-top: 16px;
}

.fontContent {
  font-size: 20px;
  height: 52px;
  text-align: left;
  padding-top: 16px;
  color: #dc9387;
}

.countNum {
  font-size: 35px;
  color: #dc9387;
}

.new-btn-sty {
  margin-right: 5px;
  color: #fff;
  background-color: #235CA7;
  border-color: #235CA7;
  font-weight: 500;
}

.new-btn-sty1 {
  margin-right: 5px;
  color: #fff;
  background-color: #598ED1;
  border-color: #598ED1;
  font-weight: 500;
}

.text-overflow {
  width: 300px; /* 超过宽度就显示... */
  text-overflow: ellipsis; /* 显示... */
  overflow: hidden; /* 隐藏文字 */
  white-space: nowrap; /* 不换行 */
  cursor: pointer; /* hover显示手形 */
}

.search-info-style {
  margin-top: 10px;
}

.table-input {
  border: #312e2e solid 1px;
  border-left: 0px;
  border-right: 0px;
  line-height: 50px;
}

.table-col {
  border: #312e2e solid 1px;
  line-height: 50px;
}
</style>
